// 引入 ECharts 主模块
var echarts = require('echarts/lib/echarts')
// 引入柱状图
require('echarts/lib/chart/bar')
require('echarts/lib/chart/line')
require('echarts/lib/chart/pie')
// 引入提示框和标题组件
require('echarts/lib/component/tooltip')
require('echarts/lib/component/title')
require('echarts/lib/component/legend')
require('echarts/lib/component/grid')
const colorTemplate1 = [
  [0.4, 'rgba(255,0,0,0.8)'],
  [0.8, 'rgba(0,255,255,0.8)'],
  [1, 'rgba(0,255,0,0.8)']
]
let num: any
export default class EchartsConfig {
  private myChart: any
  private option = {
    tooltip: {
      formatter: '{a} <br/>{b} : {c}'
    },
    series: [
      {
        type: 'gauge',
        min: 0,
        max: 900,
        splitNumber: 1,
        axisLabel: {
          fontSize: 16,
          distance: -50
        },
        title: {
          //设置仪表盘中间显示文字样式
          textStyle: {
            // 其余属性默认使用全局文本样式，详见TEXTSTYLE
            fontWeight: 'bolder',
            fontSize: 30,
            fontStyle: 'italic'
            // color: colorTemplate1
          }
        },
        data: [
          {
            value: ''
            // name: Number('{value}') > 500 ? '建议通过' : '建议拒绝'
          }
        ],
        axisLine: {
          // 仪表盘轴线(轮廓线)相关配置。
          show: true, // 是否显示仪表盘轴线(轮廓线),默认 true。
          lineStyle: {
            // 仪表盘轴线样式。
            color: colorTemplate1, //仪表盘的轴线可以被分成不同颜色的多段。
            opacity: 1, //图形透明度。支持从 0 到 1 的数字，为 0 时不绘制该图形。
            width: 10 //轴线宽度,默认 30
          }
        },
        splitLine: {
          // 分隔线样式。
          show: false // 是否显示分隔线,默认 true。
        },
        pointer: {
          // 仪表盘指针。
          length: '80%',
          width: 4
        },
        detail: {
          // 仪表盘详情，用于显示数据。
          show: true, // 是否显示详情,默认 true。
          offsetCenter: [0, '80%'], // 相对于仪表盘中心的偏移位置，数组第一项是水平方向的偏移，第二项是垂直方向的偏移。可以是绝对的数值，也可以是相对于仪表盘半径的百分比。
          color: 'auto', // 文字的颜色,默认 auto。
          fontSize: 30, // 文字的字体大小,默认 15。
          formatter: '{value}'
          // 格式化函数或者字符串
        }
      }
    ]
  }

  constructor(domId: string) {
    this.myChart = echarts.init(document.getElementById(domId))
  }
  public setOption(data: any) {
    console.log(data)
    this.option.series[0].data[0].value = data
    this.myChart && this.myChart.setOption(this.option)
  }
}
